<template>
  <div>
    <el-upload
      ref="upload"
      :auto-upload="false"
      :file-list="fileList"
      :multiple="false"
      :limit="1"
      :on-exceed="handleExceed"
      :http-request="uploadFiles"
      accept="image/jpeg, image/gif, image/png"
      action
      :on-change="changeUpload"
    >
      <el-button slot="trigger" size="mini" type="primary">拔取图片</el-button>
      <span>&nbsp;</span>
      <el-button @click="uploadFiles" size="mini" type="primary">点击上传</el-button>
    </el-upload>
  </div>
</template>
<script>
export default {
  data() {
    return {
      imgs_url: []
    };
  },
  methods: {
    uploadFiles() {
      var That = this;
      let file = this.$refs.upload.$refs["upload-inner"].$refs.input; //猎取文件数据
      let fileList = file.files;
      var imgFile;
      let reader = new FileReader(); //html5读文件
      reader.readAsDataURL(fileList[0]); //转BASE64
      reader.onload = function(e) {
        //读取终了后挪用接口
        imgFile = e.target.result;
        let obj = {
          id: "loginLogo",
          configGroup: "logo",
          configItem: "loginLogo",
          itemValue: imgFile
        };
        return BaseApi.uploadFiles(obj).then(res => {
          if (res.status == "SUCCESS") {
            AlertBox("图片上传胜利！", "success", true).then(() => {
              return That.getSysLogo(); //挪用猎取base64数据接口
            });
          } else {
            Alert("图片上传失利", res);
            return "";
          }
        });
      };
    }
  }
};
</script>